<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>
           	 后台管理系统
        </title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="format-detection" content="telephone=no">
        <link rel="stylesheet" href="./css/x-admin.css" media="all">
    </head>
    
    <body>
    	<div class="x-nav">
			<span class="layui-breadcrumb"> <a><cite>首页</cite></a> <a><cite>></cite></a> <a><cite>教员管理</cite></a> <a><cite>></cite></a>
			 	<a><cite>教员信息</cite></a> <a><cite>></cite></a> <a><cite>教员信息修改</cite></a>
			</span> <a class="layui-btn layui-btn-small"
				style="line-height: 1.6em; margin-top: 3px; float: right"
				href="javascript:location.replace(location.href);" title="刷新"><i
				class="layui-icon" style="line-height: 30px">ဂ</i></a>
		</div>
        <div class="x-body">
        	<div class="layui-upload">
	        	<div class="layui-tab layui-tab-brief">
					<div class="layui-tab-content">
						<div class="layui-tab-item layui-show">
							<form class="layui-form layui-form-pane">
				                <div class="layui-form-item">
				                    <label for="link" class="layui-form-label">
				                        <span class="x-red">*</span>教员号
				                    </label>
				                    <div class="layui-input-block">
				                        <input type="text" id="teacherNo" name="teacherNo" readonly="readonly" value="<%=request.getParameter("teacherNo")%>"
				                        autocomplete="off" class="layui-input">
				                    </div>
				                </div>
				                <div class="layui-form-item">
				                    <label for="link" class="layui-form-label">
				                        <span class="x-red">*</span>教员名
				                    </label>
				                    <div class="layui-input-block">
				                        <input type="text" id="teacherName" name="teacherName" value="<%=request.getParameter("teacherName")%>"
				                        autocomplete="off" class="layui-input">
				                    </div>
				                </div>
				                <div class="layui-form-item">
									<label for="desc" class="layui-form-label"> <span
										class="x-red">*</span>教员性别
									</label>
									<div class="layui-input-block">
										<input type="hidden" id="selectSex" value="<%=request.getParameter("teacherSex")%>">
										<select class="layui-select" name="teacherSex" id="teacherSex"></select>
									</div>
								</div>
				                <div class="layui-form-item">
				                    <label for="desc" class="layui-form-label">
				                        <span class="x-red">*</span>教员学历
				                    </label>
				                    <div class="layui-input-block">
				                    	<input type="hidden" id="selectXl" value="<%=request.getParameter("teacherXl")%>">
				                        <select class="layui-select" name="teacherXl" id="teacherXl"></select>
				                    </div>
				                </div>
				                <div class="layui-form-item">
								<label for="link" class="layui-form-label"> <span
									class="x-red">*</span>教员电话
								</label>
								<div class="layui-input-block">
									<input type="number" id="teachertel" name="teacherTel" id="teacherTel"
										lay-verify="required" autocomplete="off" class="layui-input" value="<%=request.getParameter("teacherTel")%>">
								</div>
								</div>
								<div class="layui-form-item layui-form-text">
									<label class="layui-form-label"> <span class='x-red'>*</span>教员简介
									</label>
									<div class="layui-input-block">
										<textarea placeholder="" class="layui-textarea" name="teacherDesc" id="teacherDesc" 
										lay-verify="required" ><%=request.getParameter("teacherDesc")%></textarea>
									</div>
								</div>
								<div class="layui-form-item">
									<label for="link" class="layui-form-label">教员照片</label>
									<button type="button" class="layui-btn" id="test1" name="uploadfile">
										<i class="layui-icon">&#xe67c;</i>上传图片
									</button>
									<p>&nbsp;</p>
									<div class="layui-upload-list">
										<label for="link" class="layui-form-label">预览图</label>
										<img class="layui-upload-img" id="demo1" width="100px" height="100px"
											src="<%=request.getParameter("teacherPic")%>">
										<p id="demoText"></p>
									</div>
								</div>
				                <button type="button" class="layui-btn" id="submit">保存</button>
        					</form>
        					<div style="height: 100px;"></div>
        				</div>
        			</div>
	        	</div>    
	        </div>
	  	</div>
<script src="./js/jquery-2.0.3.js" charset="utf-8"></script>
<script src="layui/layui.js" charset="utf-8"></script>
<script src="./js/x-layui.js" charset="utf-8"></script>
	<script>
	layui.use(['upload','form','element'], function(){
		  var $ = layui.jquery
		  ,upload = layui.upload;
		  
		  //普通图片上传
		  upload.render({
		    elem: '#test1'
		    ,url: 'UploadServlet' //改成您自己的上传接口
		    ,accept: 'images'
		    ,field: 'upload'
		    ,before: function(){
		      this.data = {
		    	 teacherNo : $('input[name = "teacherNo" ]').val(),
		    	 op : 'updpic',
		    	 servlet : 'TeachServlet'
		      }
		    }
		    ,choose: function(obj){
		   		obj.preview(function(index, file, result){
		 		  $('#demo1').attr('src', result); //图片链接（base64）
		 		});
		    }
		    ,done: function(res){
		      // res 服务端响应信息
		     	console.log(res.code);
		      if(res.code == 200){
		    	  layer.msg("上传成功!",{icon:6,time:1000});
	                return false;
				} else {
					layer.msg("上传失败!",{icon:5,time:2000});
					return false;
				}
		      return false;
		    }
		    ,error: function(){
		      //演示失败状态，并实现重传
		      var demoText = $('#demoText');
		      demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
		      demoText.find('.demo-reload').on('click', function(){
		        uploadInst.upload();
		      });
		    }
		  });
		  
		  // 事件监听  --- 没有修改照片的情况
		  $("#submit").click(function(){
			  var teacherNo = $('input[name = "teacherNo" ]').val();
			  var teacherName = $('input[name = "teacherName"]').val();
		      var teacherSex = $('select[name = "teacherSex"]').val();
		      var teacherXl = $('select[name = "teacherXl"]').val();
		      var teacherTel = $('input[name = "teacherTel" ]').val();
		      var teacherDesc = $('textarea[name = "teacherDesc"]').val();
			  var op = "updinfo";
			  
			  $.ajax({
				  type:"post",
				  url:"TeachServlet",
				  data:{
					  teacherNo : teacherNo,
					  teacherName : teacherName,
					  teacherSex : teacherSex,
					  teacherXl : teacherXl,
					  teacherTel : teacherTel,
					  teacherDesc : teacherDesc,
					  op : op
				  },
	             success:function (data) {
	                 if(data.code == 200 ){
	                	 layer.msg(data.msg,{icon:1,time:1000});
		                    setTimeout(function(){
		                        window.parent.location.reload();
		                        var index = parent.layer.getFrameIndex(window.name);
		                        parent.layer.close(index);
		                    },1000);
		                    return false;
	                 }else{
	                	 layer.msg(data.msg,{icon:5,time:2000});
		                 return false;
	                 }
	             },
	             dataType:"json"
		      });
			  return false;
		   });
		});
		var xl = ["本科","研究生","硕士","博士","其它"];
		var sex = ["男","女"]; 
		var selectXl = $("#selectXl").val();
		console.log(selectXl)
		var selectSeX = $("#selectSex").val();
		$(function(){
			$("#teacherXl").append("<option value = "+selectXl+">"+selectXl+"</option>");
			$.each(xl,function(i,o){
				if(o != selectXl){
					$("#teacherXl").append("<option value = "+o+">"+o+"</option>");
				}
			})
			
			$("#teacherSex").append("<option value = "+selectSeX+">"+selectSeX+"</option>");
			$.each(sex,function(i,o){
				if(o != selectSeX){
					$("#teacherSex").append("<option value = "+o+">"+o+"</option>");
				}
			})
			
			$("#teacherTel").blur(function(){
				regCheckTel();
			});
		})
		function regCheckTel(){
			var phoneNum = /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/;
			var Tel = $('input[name = "teacherTel"]').val();
			if(!phoneNum.test(Tel)){
				layer.msg("手机号格式错误!",{icon:5,time:2000});
			}
		}
	</script>
        
    </body>

</html>